<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>v-on使用</title>
</head>

<body>
  <div id="app">
    <!-- 作用：给元素绑定事件
    语法：v-on:事件名="methods定义的方法名" =》可以通过@事件名="methods定义的方法名"(简写)
    -->
    <!-- 基本用法 -->
    <div v-on:click="handlerClick">点击</div>
    <div @click="handlerClick">点击</div>
    <hr>
    <!-- 扩展用法 -->
    <!-- $event内置变量=》里边存储的是当前点击的事件对象 -->
    <div @click="handlerClick($event, 123)">点击</div>
  </div>
  <script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.12/vue.js"></script>
  <script>
    const vm = new Vue({
      el: '#app',
      data: {

      },
      methods: {
        handlerClick(ev, num) {
          console.log('点击执行了：', ev, num)
        }
      }
    })
  </script>
</body>

</html>